<!DOCTYPE html>
<html lang="ch" xmlns:th="http://www.thymeleaf.org" >
<head>
  <th:block th:include="inc :: header('密码修改')" />
</head>
<body>
    <form id="dataForm" class="layui-form layui-form-pane" style="margin: 10px">
        <div class="layui-form-item">
            <label class="layui-form-label">旧密码</label>
            <div class="layui-input-inline">
                <input type="password" name="password" class="layui-input" placeholder="请输入6-12位密码"/>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">新密码</label>
            <div class="layui-input-inline">
                <input type="password" name="pwd" class="layui-input" placeholder="请输入6-12位密码"/>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">确认密码</label>
            <div class="layui-input-inline">
                <input type="password"  class="layui-input" placeholder="请输入6-12位密码"/>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">手机号码</label>
            <div class="layui-input-inline">
                <input type="text" id="mobile" name="mobile" class="layui-input" placeholder="请输入11位手机号码"/>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">短信验证码</label>
            <div class="layui-input-inline">
                <input type="text" name="code" class="layui-input" placeholder="请输入4位手机验证码"/>
            </div>
            <div class="layui-form-mid layui-word-aux">
                <button id="btn1" style="height: 30px" >发送短信验证码</button>
            </div>
        </div>
    </form>
    <script>
        $(function(){

            $('#btn').click(function () {
                var mobile = $('#mobile').val();
                var mobileReg = "1[345678][0-9]{9}";
                if(!mobile.match(mobileReg)){
                    layui.msg("请输入正确的手机号码");
                    return false;
                }
                downTime();
                $.ajax({
                    url:'/uc/sendSms',
                    type:'post',
                    data:{
                        mobile:mobile
                    },
                    dataType:'json',
                    success:function (data) {
                        layui.msg(data.msg);
                    }
                });
            });

        });
        function downTime(){

            var i = 10;
            var s = setInterval(function () {
                $('btn1').attr('disable',true);
                $('btn1').html((i--)+'s后重新获取');
                if(i==0){
                    clearInterval(s);
                    $('btn1').attr('disable',false);
                    $('btn1').html('点击重新获取');
                }
            },1000);
        }
        layui.use('form',function () {
            
        })
    </script>
</body>
</html>